// lib/pages/news.dart
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:portal_website/pages/common_header.dart';
import 'package:portal_website/pages/empowerment_platform.dart';

import 'package:flutter/material.dart';
import 'package:portal_website/tool/image_network.dart';

class NewsPage extends StatelessWidget {
  const NewsPage({super.key});

  @override
  Widget build(BuildContext context) {
    final navItems = [
      {'name': '首页', 'route': '/'},
      {'name': '新闻资讯', 'route': '/'},
      {'name': '基地概况', 'route': '/'},
      {'name': '创新应用', 'route': '/'},
      {'name': '联系我们', 'route': '/'},
    ];

    return Scaffold(
      backgroundColor: const Color(0xFFF5F9FF),
      body: SingleChildScrollView(
        child: Container(
          width: double.infinity,
          padding: EdgeInsets.only(top: 10),
          child: Column(
            children: [
              // 面包屑导航
              Container(
                padding: EdgeInsets.symmetric(vertical: 15, horizontal: 10),
                alignment: Alignment.centerLeft,
                child: const Text(
                  '首页 > 新闻资讯',
                  style: TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 14,
                  ),
                ),
              ),
              PageTitle(
                title: "新闻资讯",
                subtitle: "濮阳人工智能创新应用示范基地最新动态、建设进展和媒体报道",
              ),

              // 动态资讯
              _buildNewsSection(),

              // 基础设施风采
              _buildGallerySection(),

              // 视频展示
              _buildVideoSection(),

              // 媒体报道
              _buildMediaSection(),

              CommonFooter(
                links: [
                  {'name': '关于我们'},
                  {'name': '新闻动态'},
                  {'name': '入驻申请'},
                  {'name': '人才招聘'},
                  {'name': '联系我们'},
                ],
                copyright: '© 2025 濮阳人工智能创新应用示范基地 版权所有',
                contactInfo:
                    '地址：河南省濮阳市高新技术开发区人工智能产业园 | 电话：0393-1234567 | 邮箱：info@puyang-ai.com',
              ),
            ],
          ),
        ),
      ),
    );
  }

  // 导航项
  Widget _navItem(String title, BuildContext context, {bool isActive = false}) {
    return TextButton(
      onPressed: () {},
      style: TextButton.styleFrom(
        padding: EdgeInsets.zero,
        minimumSize: const Size(50, 30),
      ),
      child: Text(
        title,
        style: TextStyle(
          color: Colors.white,
          fontSize: 16,
          fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
        ),
      ),
    );
  }

  // 动态资讯部分
  Widget _buildNewsSection() {
    return Container(
      margin: const EdgeInsets.only(top: 20, bottom: 20),
      padding: const EdgeInsets.all(40),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _sectionTitle('动态资讯'),
          const SizedBox(height: 30),
          Column(
            children: [
              _newsItem(
                date: '2025-07-20',
                title: '濮阳人工智能创新应用示范基地正式揭牌',
                content:
                    '7月20日，濮阳人工智能创新应用示范基地在濮阳市高新技术开发区正式揭牌成立。该基地总投资5亿元，占地面积200亩，将重点围绕智能制造、智慧城市、数字医疗等领域开展人工智能技术研发和应用示范。',
                imageUrl: '',
              ),
              _newsItem(
                date: '2025-06-15',
                title: '基地与清华大学人工智能研究院签署战略合作协议',
                content:
                    '6月15日，濮阳人工智能创新应用示范基地与清华大学人工智能研究院签署战略合作协议，双方将在人才培养、技术研发和成果转化等方面开展深度合作。清华大学将派出专家团队常驻基地，共同打造人工智能创新平台。',
                imageUrl: '',
              ),
              _newsItem(
                date: '2025-05-28',
                title: '基地首期工程竣工，10家人工智能企业入驻',
                content:
                    '5月28日，濮阳人工智能创新应用示范基地首期工程竣工并投入使用，首批10家人工智能企业正式入驻。这些企业涵盖计算机视觉、自然语言处理、智能机器人等多个领域，将为濮阳市数字化转型提供有力支撑。',
                imageUrl: '',
              ),
              _newsItem(
                date: '2025-04-10',
                title: '基地举办首届人工智能创新应用大赛',
                content:
                    '4月10日，濮阳人工智能创新应用示范基地举办首届人工智能创新应用大赛，吸引了来自全国各地的50多支团队参赛。大赛聚焦智能制造、智慧农业等本地产业需求，评选出一批优秀应用解决方案。',
                imageUrl: '',
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 新闻项
  Widget _newsItem({
    required String date,
    required String title,
    required String content,
    required String imageUrl,
  }) {
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 30),
      decoration: const BoxDecoration(
        border: Border(
          bottom: BorderSide(
            color: Color(0xFFE0E9FF),
            style: BorderStyle.solid,
          ),
        ),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 120,
            child: Text(
              date,
              style: const TextStyle(
                color: Color(0xFF207CCA),
                fontWeight: FontWeight.bold,
                fontSize: 16,
              ),
            ),
          ),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: const TextStyle(
                    fontSize: 20,
                    color: Color(0xFF1E5799),
                    fontWeight: FontWeight.bold,
                  ),
                ),
                SizedBox(
                  height: 10,
                ),
                Text(
                  content,
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 16,
                    height: 1.8,
                  ),
                ),
                SizedBox(
                  height: 15,
                ),
                TextButton(
                  onPressed: () {},
                  style: TextButton.styleFrom(
                    padding: EdgeInsets.zero,
                    minimumSize: const Size(50, 30),
                    alignment: Alignment.centerLeft,
                  ),
                  child: const Text(
                    '阅读全文 →',
                    style: TextStyle(
                      color: Color(0xFF1E5799),
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ],
            ),
          ),
          const SizedBox(width: 30),
          ImageNetwork(
            imageUrl,
            width: 300,
            height: 200,
            fit: BoxFit.cover,
          ),
        ],
      ),
    );
  }

  // 基础设施风采部分
  Widget _buildGallerySection() {
    return Container(
      margin: const EdgeInsets.all(20),
      padding: const EdgeInsets.all(40),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _sectionTitle('基础设施风采'),
          const Padding(
            padding: EdgeInsets.only(top: 30, bottom: 30),
            child: Text(
              '濮阳人工智能创新应用示范基地拥有先进的基础设施和完善的配套服务，为人工智能技术研发和应用示范提供有力支撑。',
              style: TextStyle(
                fontSize: 16,
                color: Color(0xFF666666),
              ),
            ),
          ),
          GridView.count(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            crossAxisCount: 2,
            crossAxisSpacing: 30,
            mainAxisSpacing: 30,
            childAspectRatio: 350 / 250,
            children: [
              _galleryItem(
                title: '人工智能研发中心',
                description: '建筑面积2万平方米，配备高性能计算中心和专业实验室',
                imageUrl: '',
              ),
              _galleryItem(
                title: '智能数据中心',
                description: '采用绿色节能设计，PUE值低于1.3，提供强大的数据存储和计算能力',
                imageUrl: '',
              ),
              _galleryItem(
                title: '智能应用测试场',
                description: '模拟真实场景的测试环境，支持无人驾驶、智能机器人等应用测试',
                imageUrl: '',
              ),
              _galleryItem(
                title: '人工智能培训中心',
                description: '配备先进教学设备，可同时容纳200人培训，培养AI专业人才',
                imageUrl: '',
              ),
              _galleryItem(
                title: '创新应用展示中心',
                description: '集中展示人工智能在各领域的创新应用成果和解决方案',
                imageUrl: '',
              ),
              _galleryItem(
                title: '企业孵化区',
                description: '为初创企业提供办公空间和配套服务，培育人工智能创新企业',
                imageUrl: '',
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 图片展示项
  Widget _galleryItem({
    required String title,
    required String description,
    required String imageUrl,
  }) {
    return Container(
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(8),
          border: Border.all(
            width: 1,
            color: Colors.black12,
          )
          // boxShadow: [
          //   BoxShadow(
          //     color: Colors.black12,
          //     blurRadius: 15,
          //     offset: const Offset(0, 5),
          //   ),
          // ],
          // overflow: Clip.none,
          ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 250,
            color: Colors.grey,
          ),
          // ImageNetwork(
          //   imageUrl,
          //   width: double.infinity,
          //   height: 250,
          //   fit: BoxFit.cover,
          // ),
          Container(
            padding: const EdgeInsets.all(20),
            color: Colors.white,
            width: Get.width,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: const TextStyle(
                    fontSize: 18,
                    color: Color(0xFF1E5799),
                    fontWeight: FontWeight.bold,
                  ),
                ),
                SizedBox(
                  height: 10,
                ),
                Text(
                  description,
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 14,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  // 视频展示部分
  Widget _buildVideoSection() {
    return Container(
      margin: const EdgeInsets.all(20),
      padding: const EdgeInsets.all(40),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _sectionTitle('视频展示'),
          const SizedBox(height: 30),
          AspectRatio(
            aspectRatio: 16 / 9,
            // child: WebView(
            //   initialUrl: 'https://www.youtube.com/embed/example',
            //   javascriptMode: JavascriptMode.unrestricted,
            // ),
          ),
        ],
      ),
    );
  }

  // 媒体报道部分
  Widget _buildMediaSection() {
    return Container(
      margin: const EdgeInsets.all(20),
      padding: const EdgeInsets.all(40),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _sectionTitle('媒体报道'),
          const Padding(
            padding: EdgeInsets.symmetric(vertical: 30),
            child: Text(
              '濮阳人工智能创新应用示范基地受到各级媒体广泛关注，以下是一些重点报道：',
              textAlign: TextAlign.center,
              style: TextStyle(
                fontSize: 18,
                color: Color(0xFF666666),
              ),
              maxLines: 2,
            ),
          ),
          Column(
            children: [
              _mediaItem(
                title: '央视新闻：濮阳打造人工智能创新高地',
                source: '中央电视台 | 2025年7月21日',
                content:
                    '央视新闻频道报道了濮阳人工智能创新应用示范基地揭牌仪式，重点介绍了基地在推动区域数字化转型和产业升级方面的战略意义。',
                imageUrl: 'https://via.placeholder.com/300x200?text=科技日报',
              ),
              _mediaItem(
                title: '人民日报：人工智能赋能传统产业转型',
                source: '人民日报 | 2025年6月20日',
                content:
                    '人民日报专题报道了濮阳人工智能创新应用示范基地如何通过人工智能技术帮助当地制造业企业实现智能化改造，提升生产效率。',
                imageUrl: 'https://via.placeholder.com/300x200?text=河南新闻',
              ),
              _mediaItem(
                title: '科技日报：濮阳AI基地的创新实践',
                source: '科技日报 | 2025年5月30日',
                content: '科技日报详细报道了濮阳人工智能创新应用示范基地在技术研发、成果转化和人才培养方面的创新做法和实践经验。',
                imageUrl: 'https://via.placeholder.com/300x200?text=科技日报',
              ),
              _mediaItem(
                title: '河南新闻联播：濮阳人工智能基地助力高质量发展',
                source: '河南电视台 | 2025年4月15日',
                content: '河南新闻联播专题报道了濮阳人工智能创新应用示范基地如何通过技术创新推动当地经济高质量发展。',
                imageUrl: 'https://via.placeholder.com/300x200?text=河南新闻',
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 媒体报道项
  Widget _mediaItem({
    required String title,
    required String source,
    required String content,
    required String imageUrl,
  }) {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFFF9FBFF),
        borderRadius: BorderRadius.circular(8),
        // overflow: Clip.antiAlias,
      ),
      margin: EdgeInsets.only(bottom: 30),
      child: Row(
        children: [
          ImageNetwork(
            "",
            width: 300,
            height: 200,
            fit: BoxFit.cover,
          ),
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(20),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: const TextStyle(
                      fontSize: 18,
                      color: Color(0xFF1E5799),
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  SizedBox(
                    height: 10,
                  ),
                  Text(
                    source,
                    style: const TextStyle(
                      color: Color(0xFF666666),
                      fontSize: 14,
                    ),
                  ),
                  SizedBox(
                    height: 10,
                  ),
                  Text(
                    content,
                    style: const TextStyle(
                      color: Color(0xFF555555),
                      fontSize: 15,
                      height: 1.8,
                    ),
                  ),
                  const SizedBox(height: 15),
                  TextButton(
                    onPressed: () {},
                    style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      minimumSize: const Size(50, 30),
                      alignment: Alignment.centerLeft,
                    ),
                    child: const Text(
                      '查看报道 →',
                      style: TextStyle(
                        color: Color(0xFF207CCA),
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  // section标题
  Widget _sectionTitle(String title) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: const TextStyle(
            fontSize: 24,
            color: Color(0xFF1E5799),
            fontWeight: FontWeight.bold,
          ),
        ),
        SizedBox(
          height: 15,
        ),
        Container(
          width: 80,
          height: 2,
          color: const Color(0xFF207CCA),
        ),
      ],
    );
  }
}

// 新闻条目组件

class NewsItem extends StatelessWidget {
  final Map<String, dynamic> news;

  const NewsItem({super.key, required this.news});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 20),
      decoration: const BoxDecoration(
        border: Border(
          bottom: BorderSide(
            color: Color(0xFFf0f0f0),
            width: 1,
          ),
        ),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  news['title'],
                  style: const TextStyle(
                    fontSize: 20,
                    color: Color(0xFF1e5799),
                    fontWeight: FontWeight.bold,
                    // margin: EdgeInsets.only(bottom: 10),
                  ),
                ),
                Text(
                  news['date'],
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 14,
                    // margin: EdgeInsets.only(bottom: 10),
                  ),
                ),
                Text(
                  news['description'],
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 16,
                    height: 1.8,
                    // margin: EdgeInsets.only(bottom: 15),
                  ),
                ),
                InkWell(
                  onTap: () {},
                  child: const Text(
                    '查看详情 →',
                    style: TextStyle(
                      color: Color(0xFF1e5799),
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ],
            ),
          ),
          const SizedBox(width: 30),
          ImageNetwork(
            news['imageUrl'],
            width: 300,
            height: 200,
            fit: BoxFit.cover,
            // borderRadius: BorderRadius.circular(8),
          ),
        ],
      ),
    );
  }
}

// 图片展示组件
class GalleryItem extends StatelessWidget {
  final Map<String, dynamic> gallery;

  const GalleryItem({super.key, required this.gallery});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 5,
            spreadRadius: 1,
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          ImageNetwork(
            gallery['imageUrl'],
            width: double.infinity,
            height: 250,
            fit: BoxFit.cover,
          ),
          Container(
            padding: const EdgeInsets.all(20),
            color: Colors.white,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  gallery['title'],
                  style: const TextStyle(
                    fontSize: 18,
                    color: Color(0xFF1e5799),
                    fontWeight: FontWeight.bold,
                    // margin: EdgeInsets.only(bottom: 10),
                  ),
                ),
                Text(
                  gallery['description'],
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 14,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

// 媒体报道组件
class MediaItem extends StatelessWidget {
  final Map<String, dynamic> media;

  const MediaItem({super.key, required this.media});

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.only(bottom: 30),
      decoration: BoxDecoration(
        color: const Color(0xFFf9fbff),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        children: [
          ImageNetwork(
            media['imageUrl'],
            width: 300,
            height: 200,
            fit: BoxFit.cover,
          ),
          Expanded(
            child: Container(
              padding: const EdgeInsets.all(20),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    media['title'],
                    style: const TextStyle(
                      fontSize: 18,
                      color: Color(0xFF1e5799),
                      fontWeight: FontWeight.bold,
                      // margin: EdgeInsets.only(bottom: 10),
                    ),
                  ),
                  Text(
                    media['source'],
                    style: const TextStyle(
                      color: Color(0xFF666666),
                      fontSize: 14,
                      // margin: EdgeInsets.only(bottom: 10),
                    ),
                  ),
                  Text(
                    media['description'],
                    style: const TextStyle(
                      color: Color(0xFF555555),
                      fontSize: 15,
                      height: 1.8,
                    ),
                  ),
                  const SizedBox(height: 15),
                  InkWell(
                    onTap: () {},
                    child: const Text(
                      '查看报道 →',
                      style: TextStyle(
                        color: Color(0xFF207cca),
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}
